<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>修改主题颜色</title>
    <!-- leaflet。js的基础依赖 -->
<!--    <link rel="stylesheet" type="text/css" href="leafletJs/leaflet.css">-->
<!--    <script type="text/javascript" src="leafletJs/leaflet-src.js"></script>-->
<!--    <script type="text/javascript" src="lmjs/initMap.js"></script>-->
<!--    <script type="text/javascript" src="lmjs/setMapStytle.js"></script>-->
<!--    <script type="text/javascript" src="lmjs/leaflet-tilelayer-colorizr.js"></script>-->
<!--    &lt;!&ndash;    样式js文件&ndash;&gt;-->
<!--    <script type="text/javascript" src="lmjs/mapStyle.js"></script>-->
    <!--	下面这个是依赖服务器上的js-->
    <script type="text/javascript" src="http://61.145.229.217:6199/js/lmJs/lmBase.js"></script>
    <style type="text/css">
        body {
            padding: 0;
            margin: 0;
        }

        html,
        body,
        #map {
            height: 100%;
            /* background-color: rgba(23, 27, 241, 0.1); */
        }

        /*.leaflet-zoom-animated img {*/
        /*    !* hue-rotate(380deg) invert(1)*!*/
        /*    -webkit-filter: invert(1) !important;*/
        /*}*/

    </style>
</head>

<body>
<!--  style="background-color: #191970;" -->
<div id='map'></div>
</body>
<script type="text/javascript">



    var map = L.initMap('map', {zoom: 9,mapStyle: mapStyle.blue});
    L.marker([34.694, 113.587], {title: "hahah", riseOnHover: true}).addTo(map)
        .bindPopup('Hello world ~')
        .openPopup().bindTooltip("my tooltip text").openTooltip();

    /*
    可以通过以下方式实现自定义样式
     */
    // var map = L.map("map", {
    //     center: [34.694, 113.587],
    //     renderer: L.svg(),
    //     zoom: 9,
    //     zoomControl: false, // + -号放大缩小
    //     attributionControl: false // 右下角leaflet.js图标
    // });
    // L.tileLayer.colorizr("mapFile/{z}/{x}/{y}.png", {
    //     maxZoom: 18,
    //     minZoom: 3,
    //     colorize: function (pixel) {
    //         // 科技紫
    //         pixel.r -= 26;
    //         pixel.g -= 34;
    //         pixel.b -= 111;
    //         // pixel.r += 13;
    //         // pixel.g += 17;
    //         // pixel.b += 90;
    //         return pixel;
    //     }
    // }).addTo(map);
</script>

</html>